<!DOCTYPE html>
<!-- saved from url=(0018) -->
<html class="wide wow-animation desktop landscape rd-navbar-fullwidth-linked" lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
    <title></title>
    <style>
        table, th, td {
            border: 1px solid black;
            border-collapse: collapse; /* 可选，用于合并相邻单元格的边框 */
        }

        th, td {
            padding: 10px; /* 可选，设置单元格内边距 */
        }
    </style>
</head>
<body>
<!-- Page-->
<div id="root">
    <button onclick="exportData()">导出</button>
    <table>
        <thead>
        <tr>
            <th style="width: 100px;text-align: left">任务id</th>
            <th style="width: 100px;text-align: left">类型</th>
            <th style="width: 100px;text-align: left">状态</th>
            <th style="width: 200px;text-align: left">创建时间</th>
            <th style="width: 200px;text-align: left">开始时间</th>
            <th style="width: 200px;text-align: left">结束时间</th>
            <th style="width: 200px;text-align: left">错误信息</th>
            <th style="width: 200px;text-align: left">下载地址</th>
            <th>进度</th>
        </tr>
        </thead>
        <tbody>
        <tr th:each="task ,taskIndex: ${tasks}">
            <td th:text="${task.id}">任务id</td>
            <td th:text="${task.type}">类型</td>
            <td th:text="${task.status}">状态</td>
            <td th:text="${task.createTime}">创建时间</td>
            <td th:text="${task.startTime}">开始时间</td>
            <td th:text="${task.endTime}">结束时间</td>
            <td th:text="${task.errMsg}">错误信息</td>
            <td>
                <a th:href="${task.url}" th:text="${task.url}">下载地址</a>
            </td>
            <td th:text="${task.progress}">进度</td>
        </tr>
        </tbody>
    </table>
</div>
<script>
    function exportData() {
        var xhr = new XMLHttpRequest();
        xhr.open('GET', '/export/exportAsync?type=ORDER', true);
        xhr.onload = function () {
            if (this.status >= 200 && this.status < 300) {
                console.log(this.responseText); // 处理响应数据
            } else {
                console.error('Request failed:', this.statusText);
            }
        };
        xhr.onerror = function () {
            console.error('Request error');
        };
        xhr.send();
    }

    function refresh() {
        // 你的刷新逻辑
        console.log('刷新一次');
        location.reload();
        // 例如，你可以在这里进行页面局部刷新或者数据更新
        setTimeout(refresh, 4000); // 1000毫秒后再次调用refresh函数
    }

    // demo, 暴力刷新。。。。
    setTimeout(refresh, 4000); // 初始调用一次以开始循环
</script>

</body>
</html>